<!DOCTYPE html>    
<style>
div { width:80px; font: 10px Ahem; background-color:lightgray; position: relative; }
.normal { text-indent: 4em; }
.eachline { text-indent: 4em each-line; }
.hanging { text-indent: 4em hanging; }
.eachlinehanging { text-indent: 4em each-line hanging; }
.indent { color: blue; position: absolute; }
</style>
<script src="../../../resources/check-layout.js"></script>
<p>crbug.com/568851: text-indent should be applied to leading statically positioned out-of-flow objects.</p>
<!-- normal text-indent -->
<div class="normal">
    <span data-offset-x=40 class="indent">xxxx</span>
</div>
<br>
<!-- each-line with a soft wrap break -->
<div class="eachline">
    <span data-offset-x=40 class="indent">xxxx</span> xxxx xxxx
</div>
<br>
<!-- each-line with a forced line break -->
<div class="eachline">
    <span data-offset-x=40 class="indent">xxxx</span><br><span data-offset-x=40 class="indent">xxxx</span><br><span data-offset-x=40 class="indent">xxxx</span>
</div>
<br>
<!-- each-line with a soft wrap break and a forced line break -->
<div class="eachline">
    <span data-offset-x=40 class="indent">xxxx</span> xxxx<br><span data-offset-x=40 class="indent">xxxx</span>
</div>
<br>
<!-- normal text-indent with hanging -->
<div class="hanging">
    xxxx <span data-offset-x=50 class="indent">xxxx</span><br><span data-offset-x=40 class="indent">xxxx</span>
</div>
<br>
<!-- each-line and hanging with a soft wrap break -->
<div class="eachlinehanging">
    xxxx <span data-offset-x=40 class="indent">xxxx</span> <span data-offset-x=40 class="indent">xxxx</span>
</div>
<br>
<!-- each-line and hanging with a forced line break -->
<div class="eachlinehanging">
    xxxx<br>xxxx<br>xxxx
</div>
<br>
<!-- each-line and hanging with a soft wrap break and a forced line break -->
<div class="eachlinehanging">
    xxxx <span data-offset-x=50 class="indent">xxxx</span><br>xxxx
</div>
<script>
checkLayout("span");
</script>
